/**
 * Do not edit directly, this file was auto-generated.
 */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
:root[data-theme="dark"] {
	--color-sys-text-primary: #202939;
	--color-sys-text-secondary: #364152;
	--color-sys-text-tertiary: #697586;
	--color-sys-text-placeholder: #9aa4b2;
	--color-sys-text-accent: #2970ff;
	--color-sys-text-on-accent: #ffffff;
	--color-sys-text-state-disabled: #9aa4b2;
	--color-sys-text-state-success: #12b669;
	--color-sys-text-state-warning: #fcb222;
	--color-sys-text-state-danger: #f04437;
	--color-sys-text-state-info: #202939;
	--color-sys-icon-primary: #202939;
	--color-sys-icon-secondary: #364152;
	--color-sys-icon-tertiary: #697586;
	--color-sys-icon-placeholder: #9aa4b2;
	--color-sys-icon-accent: #2970ff;
	--color-sys-icon-on-accent: #ffffff;
	--color-sys-icon-state-disabled: #9aa4b2;
	--color-sys-icon-state-success: #12b669;
	--color-sys-icon-state-warning: #fcb222;
	--color-sys-icon-state-danger: #f04437;
	--color-sys-icon-state-info: #202939;
	--color-sys-bg-primary: #202939;
	--color-sys-bg-secondary: #eef2f6;
	--color-sys-bg-tertiary: #e3e8ef;
	--color-sys-bg-placeholder: #eef2f6;
	--color-sys-bg-accent: #2970ff;
	--color-sys-bg-state-disabled: #cdd5df;
	--color-sys-bg-state-success-mid-emphasize: #ecfdf3;
	--color-sys-bg-state-success-high-emphasize: #12b669;
	--color-sys-bg-state-warning-mid-emphasize: #fee8bd;
	--color-sys-bg-state-warning-high-emphasize: #fcb222;
	--color-sys-bg-state-danger-mid-emphasize: #fef3f2;
	--color-sys-bg-state-danger-high-emphasize: #f04437;
	--color-sys-bg-state-info-mid-emphasize: #f8fafc;
	--color-sys-bg-state-info-high-emphasize: #364152;
	--color-sys-border-primary: #9aa4b2;
	--color-sys-border-secondary: #cdd5df;
	--color-sys-border-tertiary: #e3e8ef;
	--color-sys-border-placeholder: #9aa4b2;
	--color-sys-border-accent: #2970ff;
	--color-sys-border-state-disabled: #cdd5df;
	--color-sys-border-state-success: #12b669;
	--color-sys-border-state-warning: #fcb222;
	--color-sys-border-state-danger: #f04437;
	--color-sys-border-state-info: #9aa4b2;
	--color-sys-focus-ring-default: #528bff;
	--opacity-sys-overlay: 0.5;
	--shadow-sys-shadow-none: 0px 0px 0px 0px #00000000;
	--shadow-sys-shadow-sm: 0px 2px 6px 2px #00000026, 0px 1px 2px 0px #0000004d;
	--shadow-sys-shadow-m: 0px 4px 8px 3px #00000026, 0px 1px 3px 0px #0000004d;
	--shadow-sys-shadow-l: 0px 6px 10px 4px #00000026, 0px 2px 3px 0px #0000004d;
}

:root[data-theme="dark"] .btn {
	--color-comp-btn-primary-text-default: #ffffff;
	--color-comp-btn-primary-text-hover: #ffffff;
	--color-comp-btn-primary-text-pressed: #ffffff;
	--color-comp-btn-primary-text-disabled: #9aa4b2;
	--color-comp-btn-primary-icon-default: #ffffff;
	--color-comp-btn-primary-icon-hover: #ffffff;
	--color-comp-btn-primary-icon-pressed: #ffffff;
	--color-comp-btn-primary-icon-disabled: #9aa4b2;
	--color-comp-btn-primary-bg-default: #2970ff;
	--color-comp-btn-primary-bg-hover: #528bff;
	--color-comp-btn-primary-bg-pressed: #004eeb;
	--color-comp-btn-primary-bg-disabled: #eef2f6;
	--color-comp-btn-primary-border-default: #2970ff;
	--color-comp-btn-primary-border-hover: #528bff;
	--color-comp-btn-primary-border-pressed: #004eeb;
	--color-comp-btn-primary-border-disabled: #eef2f6;
	--shadow-comp-btn-primary-default: 0px 4px 8px 3px #00000026, 0px 1px 3px 0px #0000004d;
	--shadow-comp-btn-primary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-primary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-primary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-primary-danger-text-default: #ffffff;
	--color-comp-btn-primary-danger-text-hover: #ffffff;
	--color-comp-btn-primary-danger-text-pressed: #ffffff;
	--color-comp-btn-primary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-primary-danger-icon-default: #ffffff;
	--color-comp-btn-primary-danger-icon-hover: #ffffff;
	--color-comp-btn-primary-danger-icon-pressed: #ffffff;
	--color-comp-btn-primary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-primary-danger-bg-default: #f04437;
	--color-comp-btn-primary-danger-bg-hover: #f97066;
	--color-comp-btn-primary-danger-bg-pressed: #b42318;
	--color-comp-btn-primary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-primary-danger-border-default: #f04437;
	--color-comp-btn-primary-danger-border-hover: #f97066;
	--color-comp-btn-primary-danger-border-pressed: #b42318;
	--color-comp-btn-primary-danger-border-disabled: #eef2f6;
	--color-comp-btn-secondary-text-default: #202939;
	--color-comp-btn-secondary-text-hover: #364152;
	--color-comp-btn-secondary-text-pressed: #202939;
	--color-comp-btn-secondary-text-disabled: #9aa4b2;
	--color-comp-btn-secondary-icon-default: #202939;
	--color-comp-btn-secondary-icon-hover: #364152;
	--color-comp-btn-secondary-icon-pressed: #202939;
	--color-comp-btn-secondary-icon-disabled: #9aa4b2;
	--color-comp-btn-secondary-bg-default: #ffffff;
	--color-comp-btn-secondary-bg-hover: #eff4ff;
	--color-comp-btn-secondary-bg-pressed: #f8fafc;
	--color-comp-btn-secondary-bg-disabled: #eef2f6;
	--color-comp-btn-secondary-border-default: #9aa4b2;
	--color-comp-btn-secondary-border-hover: #9aa4b2;
	--color-comp-btn-secondary-border-pressed: #9aa4b2;
	--color-comp-btn-secondary-border-disabled: #eef2f6;
	--shadow-comp-btn-secondary-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-secondary-danger-text-default: #f04437;
	--color-comp-btn-secondary-danger-text-hover: #f97066;
	--color-comp-btn-secondary-danger-text-pressed: #f04437;
	--color-comp-btn-secondary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-secondary-danger-icon-default: #f04437;
	--color-comp-btn-secondary-danger-icon-hover: #f97066;
	--color-comp-btn-secondary-danger-icon-pressed: #f04437;
	--color-comp-btn-secondary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-secondary-danger-bg-default: #ffffff;
	--color-comp-btn-secondary-danger-bg-hover: #fef3f2;
	--color-comp-btn-secondary-danger-bg-pressed: #fef3f2;
	--color-comp-btn-secondary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-secondary-danger-border-default: #f97066;
	--color-comp-btn-secondary-danger-border-hover: #f97066;
	--color-comp-btn-secondary-danger-border-pressed: #f97066;
	--color-comp-btn-secondary-danger-border-disabled: #eef2f6;
	--color-comp-btn-tertiary-text-default: #202939;
	--color-comp-btn-tertiary-text-hover: #364152;
	--color-comp-btn-tertiary-text-pressed: #202939;
	--color-comp-btn-tertiary-text-disabled: #9aa4b2;
	--color-comp-btn-tertiary-icon-default: #202939;
	--color-comp-btn-tertiary-icon-hover: #364152;
	--color-comp-btn-tertiary-icon-pressed: #202939;
	--color-comp-btn-tertiary-icon-disabled: #9aa4b2;
	--color-comp-btn-tertiary-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-bg-hover: #eff4ff;
	--color-comp-btn-tertiary-bg-pressed: #f8fafc;
	--color-comp-btn-tertiary-bg-disabled: #eef2f6;
	--color-comp-btn-tertiary-border-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-border-hover: #eff4ff;
	--color-comp-btn-tertiary-border-pressed: #eef2f6;
	--color-comp-btn-tertiary-border-disabled: #eef2f6;
	--shadow-comp-btn-tertiary-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-tertiary-danger-text-default: #f04437;
	--color-comp-btn-tertiary-danger-text-hover: #f97066;
	--color-comp-btn-tertiary-danger-text-pressed: #f04437;
	--color-comp-btn-tertiary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-tertiary-danger-icon-default: #f04437;
	--color-comp-btn-tertiary-danger-icon-hover: #f97066;
	--color-comp-btn-tertiary-danger-icon-pressed: #f04437;
	--color-comp-btn-tertiary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-tertiary-danger-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-danger-bg-hover: #fef3f2;
	--color-comp-btn-tertiary-danger-bg-pressed: #fef3f2;
	--color-comp-btn-tertiary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-tertiary-danger-border-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-danger-border-hover: #fef3f2;
	--color-comp-btn-tertiary-danger-border-pressed: #fee4e2;
	--color-comp-btn-tertiary-danger-border-disabled: #eef2f6;
	--color-comp-btn-dashed-text-default: #202939;
	--color-comp-btn-dashed-text-hover: #364152;
	--color-comp-btn-dashed-text-pressed: #202939;
	--color-comp-btn-dashed-text-disabled: #9aa4b2;
	--color-comp-btn-dashed-icon-default: #202939;
	--color-comp-btn-dashed-icon-hover: #364152;
	--color-comp-btn-dashed-icon-pressed: #202939;
	--color-comp-btn-dashed-icon-disabled: #9aa4b2;
	--color-comp-btn-dashed-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-disabled: #eef2f6;
	--color-comp-btn-dashed-border-default: #9aa4b2;
	--color-comp-btn-dashed-border-hover: #cdd5df;
	--color-comp-btn-dashed-border-pressed: #697586;
	--color-comp-btn-dashed-border-disabled: #eef2f6;
	--shadow-comp-btn-dashed-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-dashed-danger-text-default: #f04437;
	--color-comp-btn-dashed-danger-text-hover: #f97066;
	--color-comp-btn-dashed-danger-text-pressed: #f04437;
	--color-comp-btn-dashed-danger-text-disabled: #9aa4b2;
	--color-comp-btn-dashed-danger-icon-default: #f04437;
	--color-comp-btn-dashed-danger-icon-hover: #f97066;
	--color-comp-btn-dashed-danger-icon-pressed: #f04437;
	--color-comp-btn-dashed-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-dashed-danger-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-disabled: #eef2f6;
	--color-comp-btn-dashed-danger-border-default: #f97066;
	--color-comp-btn-dashed-danger-border-hover: #fca19b;
	--color-comp-btn-dashed-danger-border-pressed: #f04437;
	--color-comp-btn-dashed-danger-border-disabled: #eef2f6;
}

:root[data-theme="dark"] .switch {
	--color-comp-switch-track-bg-default: #ffffff;
	--color-comp-switch-track-bg-default-selected: #2970ff;
	--color-comp-switch-track-bg-hover: #f8fafc;
	--color-comp-switch-track-bg-hover-selected: #528bff;
	--color-comp-switch-track-bg-pressed: #f8fafc;
	--color-comp-switch-track-bg-pressed-selected: #004eeb;
	--color-comp-switch-track-bg-disabled: #eef2f6;
	--color-comp-switch-track-bg-disabled-selected: #cdd5df;
	--color-comp-switch-track-border-default: #9aa4b2;
	--color-comp-switch-track-border-default-selected: #2970ff;
	--color-comp-switch-track-border-hover: #9aa4b2;
	--color-comp-switch-track-border-hover-selected: #528bff;
	--color-comp-switch-track-border-pressed: #9aa4b2;
	--color-comp-switch-track-border-pressed-selected: #004eeb;
	--color-comp-switch-track-border-disabled: #eef2f6;
	--color-comp-switch-track-border-disabled-selected: #cdd5df;
	--shadow-comp-switch-track-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-switch-thumb-bg-default: #9aa4b2;
	--color-comp-switch-thumb-bg-default-selected: #ffffff;
	--color-comp-switch-thumb-bg-hover: #cdd5df;
	--color-comp-switch-thumb-bg-hover-selected: #ffffff;
	--color-comp-switch-thumb-bg-pressed: #697586;
	--color-comp-switch-thumb-bg-pressed-selected: #ffffff;
	--color-comp-switch-thumb-bg-disabled: #9aa4b2;
	--color-comp-switch-thumb-bg-disabled-selected: #ffffff;
	--color-comp-switch-thumb-border-default: #9aa4b2;
	--color-comp-switch-thumb-border-default-selected: #ffffff;
	--color-comp-switch-thumb-border-hover: #cdd5df;
	--color-comp-switch-thumb-border-hover-selected: #ffffff;
	--color-comp-switch-thumb-border-pressed: #697586;
	--color-comp-switch-thumb-border-pressed-selected: #ffffff;
	--color-comp-switch-thumb-border-disabled: #cdd5df;
	--color-comp-switch-thumb-border-disabled-selected: #ffffff;
	--shadow-comp-switch-thumb-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-thumb-hover: 0px 1px 3px 1px #00000026, 0px 1px 2px 0px #0000004d;
	--shadow-comp-switch-thumb-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-thumb-disabled: 0px 0px 0px 0px #00000000;
}

:root[data-theme="dark"] .focusRing {
	--color-comp-focus-ring-default: #528bff;
}

:root[data-theme="dark"] .tooltip {
	--color-comp-tooltip-text: #ffffff;
	--color-comp-tooltip-bg: #202939;
	--color-comp-tooltip-border: #202939;
}

:root[data-theme="dark"] .breadcrumb {
	--color-comp-breadcrumb-link-text-default: #202939;
	--color-comp-breadcrumb-link-text-hover: #202939;
	--color-comp-breadcrumb-link-text-pressed: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-default: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-hover: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-pressed: #9aa4b2;
	--color-comp-breadcrumb-separator-icon: #9aa4b2;
	--color-comp-breadcrumb-page-text: #9aa4b2;
}

:root[data-theme="dark"] .sidebar {
	--color-comp-sidebar-bg: #f5f8ff;
	--color-comp-sidebar-border: #b2ccff;
	--color-comp-sidebar-header-default-collapse-action-icon-default: #697586;
	--color-comp-sidebar-header-default-collapse-action-icon-hover: #9aa4b2;
	--color-comp-sidebar-header-default-collapse-action-icon-pressed: #364152;
	--color-comp-sidebar-header-default-collapse-action-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-pressed: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-collapsed-collapse-action-icon-default: #697586;
	--color-comp-sidebar-header-collapsed-collapse-action-icon-hover: #9aa4b2;
	--color-comp-sidebar-header-collapsed-collapse-action-icon-pressed: #364152;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-default: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-hover: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-pressed: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-default: #b2ccff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-hover: #b2ccff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-pressed: #b2ccff;
	--color-comp-sidebar-footer-separator-divider: #e3e8ef;
	--color-comp-sidebar-footer-powered-by-text: #697586;
	--color-comp-sidebar-footer-powered-by-logo: #4b5565;
	--color-comp-sidebar-group-label-text-default: #9aa4b2;
	--color-comp-sidebar-group-label-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-group-label-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-group-label-separator-default: #9aa4b2;
	--color-comp-sidebar-menu-item-text-default: #364152;
	--color-comp-sidebar-menu-item-text-default-hover: #364152;
	--color-comp-sidebar-menu-item-text-selected: #004eeb;
	--color-comp-sidebar-menu-item-text-selected-hover: #004eeb;
	--color-comp-sidebar-menu-item-icon-default: #697586;
	--color-comp-sidebar-menu-item-icon-default-hover: #697586;
	--color-comp-sidebar-menu-item-icon-selected: #004eeb;
	--color-comp-sidebar-menu-item-icon-selected-hover: #004eeb;
	--color-comp-sidebar-menu-item-action-icon-default: #697586;
	--color-comp-sidebar-menu-item-action-icon-default-hover: #697586;
	--color-comp-sidebar-menu-item-action-icon-selected: #697586;
	--color-comp-sidebar-menu-item-action-icon-selected-hover: #697586;
	--color-comp-sidebar-menu-item-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-item-bg-default-hover: #eef2f6;
	--color-comp-sidebar-menu-item-bg-selected: #d1e0ff;
	--color-comp-sidebar-menu-item-bg-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-item-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-item-border-default-hover: #eef2f6;
	--color-comp-sidebar-menu-item-border-selected: #d1e0ff;
	--color-comp-sidebar-menu-item-border-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-connector-default: rgba(75, 85, 101, 0.10);
	--color-comp-sidebar-menu-sub-connector-selected: rgba(75, 85, 101, 0.10);
	--color-comp-sidebar-menu-sub-item-text-default: #364152;
	--color-comp-sidebar-menu-sub-item-text-default-hover: #364152;
	--color-comp-sidebar-menu-sub-item-text-selected: #004eeb;
	--color-comp-sidebar-menu-sub-item-text-selected-hover: #004eeb;
	--color-comp-sidebar-menu-sub-item-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-bg-default-hover: #eef2f6;
	--color-comp-sidebar-menu-sub-item-bg-selected: #d1e0ff;
	--color-comp-sidebar-menu-sub-item-bg-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-item-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-border-default-hover: #eef2f6;
	--color-comp-sidebar-menu-sub-item-border-selected: #d1e0ff;
	--color-comp-sidebar-menu-sub-item-border-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-item-selection-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-selection-default-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-selection-selected: #004eeb;
	--color-comp-sidebar-menu-sub-item-selection-selected-hover: #004eeb;
}

:root[data-theme="dark"] .badge {
	--color-comp-badge-primary-info-text: #ffffff;
	--color-comp-badge-primary-info-icon: #ffffff;
	--color-comp-badge-primary-info-bg: #2970ff;
	--color-comp-badge-primary-info-border: #ffffff;
	--color-comp-badge-primary-danger-text: #ffffff;
	--color-comp-badge-primary-danger-icon: #ffffff;
	--color-comp-badge-primary-danger-bg: #f04437;
	--color-comp-badge-primary-danger-border: #ffffff;
	--color-comp-badge-primary-success-text: #ffffff;
	--color-comp-badge-primary-success-icon: #ffffff;
	--color-comp-badge-primary-success-bg: #039754;
	--color-comp-badge-primary-success-border: #ffffff;
	--color-comp-badge-primary-warning-text: #ffffff;
	--color-comp-badge-primary-warning-icon: #ffffff;
	--color-comp-badge-primary-warning-bg: #d7991f;
	--color-comp-badge-primary-warning-border: #ffffff;
	--color-comp-badge-secondary-info-text: #202939;
	--color-comp-badge-secondary-info-icon: #202939;
	--color-comp-badge-secondary-info-bg: #e3e8ef;
	--color-comp-badge-secondary-info-border: #9aa4b2;
	--color-comp-badge-secondary-danger-text: #d92c20;
	--color-comp-badge-secondary-danger-icon: #d92c20;
	--color-comp-badge-secondary-danger-bg: #fee4e2;
	--color-comp-badge-secondary-danger-border: #f04437;
	--color-comp-badge-secondary-success-text: #027a48;
	--color-comp-badge-secondary-success-icon: #027a48;
	--color-comp-badge-secondary-success-bg: #d1fadf;
	--color-comp-badge-secondary-success-border: #039754;
	--color-comp-badge-secondary-warning-text: #202939;
	--color-comp-badge-secondary-warning-icon: #202939;
	--color-comp-badge-secondary-warning-bg: #fdd890;
	--color-comp-badge-secondary-warning-border: #d7991f;
}

:root[data-theme="dark"] .dropdownMenu {
	--color-comp-dropdown-menu-bg: #ffffff;
	--color-comp-dropdown-menu-border: #e3e8ef;
	--color-comp-dropdown-menu-label-text: #697586;
	--color-comp-dropdown-menu-item-text-default: #364152;
	--color-comp-dropdown-menu-item-text-hover: #364152;
	--color-comp-dropdown-menu-item-text-pressed: #364152;
	--color-comp-dropdown-menu-item-text-selected: #364152;
	--color-comp-dropdown-menu-item-text-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-icon-leading-default: #364152;
	--color-comp-dropdown-menu-item-icon-leading-hover: #364152;
	--color-comp-dropdown-menu-item-icon-leading-pressed: #364152;
	--color-comp-dropdown-menu-item-icon-leading-selected: #364152;
	--color-comp-dropdown-menu-item-icon-leading-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-icon-trailing-default: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-hover: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-pressed: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-selected: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-bg-default: #ffffff;
	--color-comp-dropdown-menu-item-bg-hover: #f5f8ff;
	--color-comp-dropdown-menu-item-bg-pressed: #eff4ff;
	--color-comp-dropdown-menu-item-bg-selected: #eff4ff;
	--color-comp-dropdown-menu-item-bg-disabled: #f8fafc;
	--color-comp-dropdown-menu-item-border-default: #ffffff;
	--color-comp-dropdown-menu-item-border-hover: #f5f8ff;
	--color-comp-dropdown-menu-item-border-pressed: #eff4ff;
	--color-comp-dropdown-menu-item-border-selected: #eff4ff;
	--color-comp-dropdown-menu-item-border-disabled: #f8fafc;
	--color-comp-dropdown-menu-item-indicator-icon-default: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-hover: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-pressed: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-checked: #2970ff;
	--color-comp-dropdown-menu-item-indicator-icon-disabled: #9aa4b2;
	--color-comp-dropdown-menu-shortcut-text-default: #697586;
	--color-comp-dropdown-menu-shortcut-text-hover: #697586;
	--color-comp-dropdown-menu-shortcut-text-pressed: #697586;
	--color-comp-dropdown-menu-shortcut-text-selected: #697586;
	--color-comp-dropdown-menu-shortcut-text-disabled: #9aa4b2;
	--color-comp-dropdown-menu-separator-line: #e3e8ef;
	--shadow-comp-dropdown-menu-content: 0px 1px 3px 1px #00000026, 0px 1px 2px 0px #0000004d;
}
@media (min-width: 769px) {
	:root[lang="ar"] {
		--typography-display-medium: 700 48px/56px 'IBM Plex Sans Arabic';
		--typography-headline-large: 700 40px/48px 'IBM Plex Sans Arabic';
		--typography-headline-medium: 600 32px/44px 'IBM Plex Sans Arabic';
		--typography-headline-small: 600 24px/32px 'IBM Plex Sans Arabic';
		--typography-title-large: 600 20px/32px 'IBM Plex Sans Arabic';
		--typography-title-medium: 600 16px/28px 'IBM Plex Sans Arabic';
		--typography-title-small: 600 14px/24px 'IBM Plex Sans Arabic';
		--typography-body-large: 400 16px/28px 'IBM Plex Sans Arabic';
		--typography-body-medium: 400 14px/24px 'IBM Plex Sans Arabic';
		--typography-body-small: 400 12px/18px 'IBM Plex Sans Arabic';
		--typography-label-large: 500 16px/24px 'IBM Plex Sans Arabic';
		--typography-label-medium: 500 14px/24px 'IBM Plex Sans Arabic';
		--typography-label-small: 500 12px/18px 'IBM Plex Sans Arabic';
	}
}
@media (min-width: 769px) {
	:root[lang="en"] {
		--typography-display-medium: 700 48px/56px Poppins;
		--typography-headline-large: 700 40px/48px Poppins;
		--typography-headline-medium: 600 32px/40px Poppins;
		--typography-headline-small: 600 24px/32px Poppins;
		--typography-title-large: 600 20px/28px Poppins;
		--typography-title-medium: 600 16px/24px Poppins;
		--typography-title-small: 600 14px/20px Poppins;
		--typography-body-large: 400 16px/24px Poppins;
		--typography-body-medium: 400 14px/20px Poppins;
		--typography-body-small: 400 12px/16px Poppins;
		--typography-label-large: 500 16px/24px Poppins;
		--typography-label-medium: 500 14px/20px Poppins;
		--typography-label-small: 500 12px/16px Poppins;
	}
}
@media (min-width: 769px) {
	:root {
		--dimension-sys-corner-none: 0px;
		--dimension-sys-corner-xs: 2px;
		--dimension-sys-corner-s: 4px;
		--dimension-sys-corner-m: 8px;
		--dimension-sys-corner-l: 16px;
		--dimension-sys-corner-xl: 32px;
		--dimension-sys-corner-full: 400px;
		--dimension-sys-spacing-none: 0px;
		--dimension-sys-spacing-xs: 4px;
		--dimension-sys-spacing-s: 8px;
		--dimension-sys-spacing-m: 16px;
		--dimension-sys-spacing-l: 24px;
		--dimension-sys-spacing-xl: 40px;
		--dimension-sys-size-none: 0px;
		--dimension-sys-size-xs: 8px;
		--dimension-sys-size-s: 16px;
		--dimension-sys-size-m: 24px;
		--dimension-sys-size-l: 32px;
		--dimension-sys-size-xl: 40px;
		--dimension-sys-size-xxl: 48px;
		--dimension-sys-stroke-solid: solid;
		--dimension-sys-stroke-dashed: solid;
		--dimension-sys-focus-ring-outline-width: 2px;
		--dimension-sys-focus-ring-outline-offset: 2px;
		--dimension-sys-focus-ring-stroke-style: solid;
		--dimension-sys-icon-size-s: 16px;
		--dimension-sys-icon-size-m: 24px;
		--dimension-sys-icon-size-l: 32px;
		--transition-sys-duration-fast: 50ms;
		--transition-sys-duration-medium: 500ms;
		--transition-sys-duration-slow: 1000ms;
	}
}


@media (min-width: 769px) {
	:root .btn {
		--dimension-comp-btn-m-spacing-v: 12px;
		--dimension-comp-btn-m-spacing-h: 12px;
		--dimension-comp-btn-m-height: 40px;
		--dimension-comp-btn-m-width-min: 40px;
		--dimension-comp-btn-m-gap: 4px;
		--dimension-comp-btn-m-border-radius: 8px;
		--dimension-comp-btn-m-border-width: 1px;
		--dimension-comp-btn-m-stroke-style: solid;
		--dimension-comp-btn-m-focus-ring-radius: 10px;
		--dimension-comp-btn-m-icon-size: 16px;
		--dimension-comp-btn-s-spacing-v: 8px;
		--dimension-comp-btn-s-spacing-h: 12px;
		--dimension-comp-btn-s-height: 32px;
		--dimension-comp-btn-s-width-min: 32px;
		--dimension-comp-btn-s-gap: 4px;
		--dimension-comp-btn-s-border-radius: 8px;
		--dimension-comp-btn-s-border-width: 1px;
		--dimension-comp-btn-s-stroke-style: solid;
		--dimension-comp-btn-s-focus-ring-radius: 10px;
		--dimension-comp-btn-s-icon-size: 12px;
		--dimension-comp-btn-primary-m-spacing-v: 12px;
		--dimension-comp-btn-primary-m-spacing-h: 12px;
		--dimension-comp-btn-primary-m-height: 40px;
		--dimension-comp-btn-primary-m-width-min: 40px;
		--dimension-comp-btn-primary-m-gap: 4px;
		--dimension-comp-btn-primary-m-border-radius: 8px;
		--dimension-comp-btn-primary-m-border-width: 1px;
		--dimension-comp-btn-primary-m-stroke-style: solid;
		--dimension-comp-btn-primary-m-focus-ring-radius: 10px;
		--dimension-comp-btn-primary-m-icon-size: 16px;
		--dimension-comp-btn-primary-s-spacing-v: 8px;
		--dimension-comp-btn-primary-s-spacing-h: 12px;
		--dimension-comp-btn-primary-s-height: 32px;
		--dimension-comp-btn-primary-s-width-min: 32px;
		--dimension-comp-btn-primary-s-gap: 4px;
		--dimension-comp-btn-primary-s-border-radius: 8px;
		--dimension-comp-btn-primary-s-border-width: 1px;
		--dimension-comp-btn-primary-s-stroke-style: solid;
		--dimension-comp-btn-primary-s-focus-ring-radius: 10px;
		--dimension-comp-btn-primary-s-icon-size: 12px;
		--transition-comp-btn-hover-duration: 50ms;
		--transition-comp-btn-hover-easing: 0.5,0,1,1;
		--transition-comp-btn-press-duration: 50ms;
		--transition-comp-btn-press-easing: 0.5,0,1,1;
	}

	:root .switch {
		--dimension-comp-switch-track-spacing: 2px;
		--dimension-comp-switch-track-height: 20px;
		--dimension-comp-switch-track-width: 36px;
		--dimension-comp-switch-track-border-radius: 400px;
		--dimension-comp-switch-track-border-width: 1px;
		--dimension-comp-switch-track-focus-ring-radius: 402px;
		--dimension-comp-switch-thumb-height: 16px;
		--dimension-comp-switch-thumb-width: 16px;
		--dimension-comp-switch-thumb-border-radius: 400px;
		--dimension-comp-switch-thumb-border-width: 0px;
	}

	:root .focusRing {
		--dimension-comp-focus-ring-outline-width: 2px;
		--dimension-comp-focus-ring-outline-offset: 2px;
		--dimension-comp-focus-ring-stroke-style: solid;
	}

	:root .tooltip {
		--dimension-comp-tooltip-spacing-v: 6px;
		--dimension-comp-tooltip-spacing-h: 6px;
		--dimension-comp-tooltip-width-max-s: 140px;
		--dimension-comp-tooltip-width-max-m: 280px;
		--dimension-comp-tooltip-width-max-l: 420px;
		--dimension-comp-tooltip-border-radius: 4px;
		--dimension-comp-tooltip-border-width: 1px;
		--dimension-comp-tooltip-offset: 4px;
		--dimension-comp-tooltip-arrow-spacing: 4px;
	}

	:root .breadcrumb {
		--dimension-comp-breadcrumb-gap: 8px;
		--dimension-comp-breadcrumb-spacing-v: 4px;
		--dimension-comp-breadcrumb-ellipsis-size: 16px;
		--dimension-comp-breadcrumb-separator-size: 16px;
	}

	:root .sidebar {
		--dimension-comp-sidebar-width-default: 256px;
		--dimension-comp-sidebar-width-compact: 56px;
		--dimension-comp-sidebar-spacing-v: 4px;
		--dimension-comp-sidebar-spacing-h: 4px;
		--dimension-comp-sidebar-border-radius: 12px;
		--dimension-comp-sidebar-border-width: 1px;
		--dimension-comp-sidebar-stroke-style: solid;
		--dimension-comp-sidebar-header-default-spacing-v: 12px;
		--dimension-comp-sidebar-header-default-spacing-h-leading: 12px;
		--dimension-comp-sidebar-header-default-spacing-h-trailing: 12px;
		--dimension-comp-sidebar-header-default-gap: 4px;
		--dimension-comp-sidebar-header-default-logo-height: 36px;
		--dimension-comp-sidebar-header-default-collapse-action-icon-size: 20px;
		--dimension-comp-sidebar-header-default-collapse-action-spacing-v: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-spacing-h: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-border-radius: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-border-width: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-stroke-style: solid;
		--dimension-comp-sidebar-header-collapsed-spacing-v: 12px;
		--dimension-comp-sidebar-header-collapsed-spacing-h-leading: 6px;
		--dimension-comp-sidebar-header-collapsed-spacing-h-trailing: 0px;
		--dimension-comp-sidebar-header-collapsed-gap: 5px;
		--dimension-comp-sidebar-header-collapsed-logo-height: 36px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-icon-size: 20px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-spacing-v: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-spacing-h: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-border-radius: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-border-width: 1px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-stroke-style: solid;
		--dimension-comp-sidebar-content-default-spacing-v: 0px;
		--dimension-comp-sidebar-content-default-spacing-h: 6px;
		--dimension-comp-sidebar-content-collapsed-spacing-v: 0px;
		--dimension-comp-sidebar-content-collapsed-spacing-h: 6px;
		--dimension-comp-sidebar-footer-default-spacing-v: 12px;
		--dimension-comp-sidebar-footer-default-spacing-h: 6px;
		--dimension-comp-sidebar-footer-default-separator-spacing-v: 12px;
		--dimension-comp-sidebar-footer-default-separator-spacing-h: 8px;
		--dimension-comp-sidebar-footer-default-separator-border-width: 1px;
		--dimension-comp-sidebar-footer-default-separator-stroke-style: solid;
		--dimension-comp-sidebar-footer-default-powered-by-logo-height: 14px;
		--dimension-comp-sidebar-footer-default-powered-by-spacing-h: 8px;
		--dimension-comp-sidebar-footer-default-powered-by-height: 16px;
		--dimension-comp-sidebar-footer-collapsed-spacing-v: 12px;
		--dimension-comp-sidebar-footer-collapsed-spacing-h: 6px;
		--dimension-comp-sidebar-footer-collapsed-separator-spacing-v: 12px;
		--dimension-comp-sidebar-footer-collapsed-separator-spacing-h: 8px;
		--dimension-comp-sidebar-footer-collapsed-separator-border-width: 1px;
		--dimension-comp-sidebar-footer-collapsed-separator-stroke-style: solid;
		--dimension-comp-sidebar-footer-collapsed-powered-by-logo-height: 14px;
		--dimension-comp-sidebar-footer-collapsed-powered-by-spacing-h: 8px;
		--dimension-comp-sidebar-footer-collapsed-powered-by-height: 16px;
		--dimension-comp-sidebar-group-label-default-spacing-v: 10px;
		--dimension-comp-sidebar-group-label-default-spacing-h: 10px;
		--dimension-comp-sidebar-group-label-default-height: 36px;
		--dimension-comp-sidebar-group-label-compact-spacing-v: 10px;
		--dimension-comp-sidebar-group-label-compact-spacing-h: 10px;
		--dimension-comp-sidebar-group-label-compact-width-min: 36px;
		--dimension-comp-sidebar-group-label-compact-height: 36px;
		--dimension-comp-sidebar-group-label-compact-separator-border-width: 1px;
		--dimension-comp-sidebar-group-label-compact-separator-stroke-style: solid;
		--dimension-comp-sidebar-menu-border-radius: 12px;
		--dimension-comp-sidebar-menu-item-default-text-spacing-v: 10px;
		--dimension-comp-sidebar-menu-item-default-icon-size: 20px;
		--dimension-comp-sidebar-menu-item-default-icon-spacing-v: 8px;
		--dimension-comp-sidebar-menu-item-default-action-icon-size: 16px;
		--dimension-comp-sidebar-menu-item-default-spacing-h: 8px;
		--dimension-comp-sidebar-menu-item-default-gap: 8px;
		--dimension-comp-sidebar-menu-item-default-border-radius: 8px;
		--dimension-comp-sidebar-menu-item-default-border-width: 1px;
		--dimension-comp-sidebar-menu-item-default-stroke-style: solid;
		--dimension-comp-sidebar-menu-item-default-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-item-compact-icon-size: 20px;
		--dimension-comp-sidebar-menu-item-compact-icon-spacing-v: 8px;
		--dimension-comp-sidebar-menu-item-compact-spacing-h: 8px;
		--dimension-comp-sidebar-menu-item-compact-gap: 8px;
		--dimension-comp-sidebar-menu-item-compact-border-radius: 8px;
		--dimension-comp-sidebar-menu-item-compact-border-width: 1px;
		--dimension-comp-sidebar-menu-item-compact-stroke-style: solid;
		--dimension-comp-sidebar-menu-item-compact-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-item-compact-width-min: 36px;
		--dimension-comp-sidebar-menu-sub-margin-leading: 17px;
		--dimension-comp-sidebar-menu-sub-margin-trailing: 0px;
		--dimension-comp-sidebar-menu-sub-spacing-leading: 9px;
		--dimension-comp-sidebar-menu-sub-spacing-trailing: 0px;
		--dimension-comp-sidebar-menu-sub-connector-border-width: 2px;
		--dimension-comp-sidebar-menu-sub-connector-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-connector-linecap: butt;
		--dimension-comp-sidebar-menu-sub-item-text-spacing-v: 10px;
		--dimension-comp-sidebar-menu-sub-item-spacing-h: 8px;
		--dimension-comp-sidebar-menu-sub-item-gap: 8px;
		--dimension-comp-sidebar-menu-sub-item-border-radius: 8px;
		--dimension-comp-sidebar-menu-sub-item-border-width: 1px;
		--dimension-comp-sidebar-menu-sub-item-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-item-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-sub-item-selection-spacing-v: 8px;
		--dimension-comp-sidebar-menu-sub-item-selection-border-width: 2px;
		--dimension-comp-sidebar-menu-sub-item-selection-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-item-selection-linecap: butt;
	}

	:root .badge {
		--dimension-comp-badge-icon-size: 12px;
		--dimension-comp-badge-height: 24px;
		--dimension-comp-badge-spacing-h: 6px;
		--dimension-comp-badge-dot-height: 6px;
		--dimension-comp-badge-gap: 4px;
		--dimension-comp-badge-width-min: 24px;
		--dimension-comp-badge-border-radius: 400px;
		--dimension-comp-badge-border-width: 1px;
		--dimension-comp-badge-stroke-style: solid;
	}

	:root .dropdownMenu {
		--dimension-comp-dropdown-menu-side-offset: 8px;
		--dimension-comp-dropdown-menu-arrow-spacing-h: 16px;
		--dimension-comp-dropdown-menu-content-spacing-v: 4px;
		--dimension-comp-dropdown-menu-content-spacing-h: 4px;
		--dimension-comp-dropdown-menu-content-width: 200px;
		--dimension-comp-dropdown-menu-content-gap: 0px;
		--dimension-comp-dropdown-menu-content-border-radius: 8px;
		--dimension-comp-dropdown-menu-content-border-width: 1px;
		--dimension-comp-dropdown-menu-content-stroke-style: solid;
		--dimension-comp-dropdown-menu-label-spacing-v: 8px;
		--dimension-comp-dropdown-menu-label-spacing-h: 12px;
		--dimension-comp-dropdown-menu-group-spacing-v: 0px;
		--dimension-comp-dropdown-menu-group-spacing-h: 0px;
		--dimension-comp-dropdown-menu-group-gap: 0px;
		--dimension-comp-dropdown-menu-item-spacing-v: 12px;
		--dimension-comp-dropdown-menu-item-spacing-h: 12px;
		--dimension-comp-dropdown-menu-item-gap: 6px;
		--dimension-comp-dropdown-menu-item-border-radius: 6px;
		--dimension-comp-dropdown-menu-item-border-width: 1px;
		--dimension-comp-dropdown-menu-item-stroke-style: solid;
		--dimension-comp-dropdown-menu-item-focus-ring-radius: 8px;
		--dimension-comp-dropdown-menu-item-icon-leading-size: 20px;
		--dimension-comp-dropdown-menu-item-icon-trailing-size: 20px;
		--dimension-comp-dropdown-menu-item-image-size: 24px;
		--dimension-comp-dropdown-menu-item-indicator-spacing-v: 0px;
		--dimension-comp-dropdown-menu-item-indicator-spacing-h: 0px;
		--dimension-comp-dropdown-menu-item-indicator-icon-size: 20px;
		--dimension-comp-dropdown-menu-separator-spacing-v: 4px;
		--dimension-comp-dropdown-menu-separator-spacing-h: -4px;
		--dimension-comp-dropdown-menu-separator-border-width: 1px;
		--dimension-comp-dropdown-menu-separator-stroke-style: solid;
	}

}
:root[data-theme="light"] {
	--color-sys-text-primary: #202939;
	--color-sys-text-secondary: #364152;
	--color-sys-text-tertiary: #697586;
	--color-sys-text-placeholder: #9aa4b2;
	--color-sys-text-accent: #2970ff;
	--color-sys-text-on-accent: #ffffff;
	--color-sys-text-state-disabled: #9aa4b2;
	--color-sys-text-state-success: #12b669;
	--color-sys-text-state-warning: #fcb222;
	--color-sys-text-state-danger: #f04437;
	--color-sys-text-state-info: #202939;
	--color-sys-icon-primary: #202939;
	--color-sys-icon-secondary: #364152;
	--color-sys-icon-tertiary: #697586;
	--color-sys-icon-placeholder: #9aa4b2;
	--color-sys-icon-accent: #2970ff;
	--color-sys-icon-on-accent: #ffffff;
	--color-sys-icon-state-disabled: #9aa4b2;
	--color-sys-icon-state-success: #12b669;
	--color-sys-icon-state-warning: #fcb222;
	--color-sys-icon-state-danger: #f04437;
	--color-sys-icon-state-info: #202939;
	--color-sys-bg-primary: #ffffff;
	--color-sys-bg-secondary: #eef2f6;
	--color-sys-bg-tertiary: #e3e8ef;
	--color-sys-bg-placeholder: #eef2f6;
	--color-sys-bg-accent: #2970ff;
	--color-sys-bg-state-disabled: #cdd5df;
	--color-sys-bg-state-success-mid-emphasize: #ecfdf3;
	--color-sys-bg-state-success-high-emphasize: #12b669;
	--color-sys-bg-state-warning-mid-emphasize: #fee8bd;
	--color-sys-bg-state-warning-high-emphasize: #fcb222;
	--color-sys-bg-state-danger-mid-emphasize: #fef3f2;
	--color-sys-bg-state-danger-high-emphasize: #f04437;
	--color-sys-bg-state-info-mid-emphasize: #f8fafc;
	--color-sys-bg-state-info-high-emphasize: #364152;
	--color-sys-border-primary: #9aa4b2;
	--color-sys-border-secondary: #cdd5df;
	--color-sys-border-tertiary: #e3e8ef;
	--color-sys-border-placeholder: #9aa4b2;
	--color-sys-border-accent: #2970ff;
	--color-sys-border-state-disabled: #cdd5df;
	--color-sys-border-state-success: #12b669;
	--color-sys-border-state-warning: #fcb222;
	--color-sys-border-state-danger: #f04437;
	--color-sys-border-state-info: #9aa4b2;
	--color-sys-focus-ring-default: #528bff;
	--opacity-sys-overlay: 0.5;
	--shadow-sys-shadow-none: 0px 0px 0px 0px #00000000;
	--shadow-sys-shadow-sm: 0px 1px 2px 0px #0000004d, 0px 2px 6px 2px #00000026;
	--shadow-sys-shadow-m: 0px 4px 8px 3px #00000026, 0px 1px 3px 0px #0000004d;
	--shadow-sys-shadow-l: 0px 6px 10px 4px #00000026, 0px 2px 3px 0px #0000004d;
}

:root[data-theme="light"] .btn {
	--color-comp-btn-primary-text-default: #ffffff;
	--color-comp-btn-primary-text-hover: #ffffff;
	--color-comp-btn-primary-text-pressed: #ffffff;
	--color-comp-btn-primary-text-disabled: #9aa4b2;
	--color-comp-btn-primary-icon-default: #ffffff;
	--color-comp-btn-primary-icon-hover: #ffffff;
	--color-comp-btn-primary-icon-pressed: #ffffff;
	--color-comp-btn-primary-icon-disabled: #9aa4b2;
	--color-comp-btn-primary-bg-default: #2970ff;
	--color-comp-btn-primary-bg-hover: #528bff;
	--color-comp-btn-primary-bg-pressed: #004eeb;
	--color-comp-btn-primary-bg-disabled: #eef2f6;
	--color-comp-btn-primary-border-default: #2970ff;
	--color-comp-btn-primary-border-hover: #528bff;
	--color-comp-btn-primary-border-pressed: #004eeb;
	--color-comp-btn-primary-border-disabled: #eef2f6;
	--shadow-comp-btn-primary-default: 0px 4px 8px 3px #00000026, 0px 1px 3px 0px #0000004d;
	--shadow-comp-btn-primary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-primary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-primary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-primary-danger-text-default: #ffffff;
	--color-comp-btn-primary-danger-text-hover: #ffffff;
	--color-comp-btn-primary-danger-text-pressed: #ffffff;
	--color-comp-btn-primary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-primary-danger-icon-default: #ffffff;
	--color-comp-btn-primary-danger-icon-hover: #ffffff;
	--color-comp-btn-primary-danger-icon-pressed: #ffffff;
	--color-comp-btn-primary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-primary-danger-bg-default: #f04437;
	--color-comp-btn-primary-danger-bg-hover: #f97066;
	--color-comp-btn-primary-danger-bg-pressed: #b42318;
	--color-comp-btn-primary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-primary-danger-border-default: #f04437;
	--color-comp-btn-primary-danger-border-hover: #f97066;
	--color-comp-btn-primary-danger-border-pressed: #b42318;
	--color-comp-btn-primary-danger-border-disabled: #eef2f6;
	--color-comp-btn-secondary-text-default: #202939;
	--color-comp-btn-secondary-text-hover: #364152;
	--color-comp-btn-secondary-text-pressed: #202939;
	--color-comp-btn-secondary-text-disabled: #9aa4b2;
	--color-comp-btn-secondary-icon-default: #202939;
	--color-comp-btn-secondary-icon-hover: #364152;
	--color-comp-btn-secondary-icon-pressed: #202939;
	--color-comp-btn-secondary-icon-disabled: #9aa4b2;
	--color-comp-btn-secondary-bg-default: #ffffff;
	--color-comp-btn-secondary-bg-hover: #eff4ff;
	--color-comp-btn-secondary-bg-pressed: #f8fafc;
	--color-comp-btn-secondary-bg-disabled: #eef2f6;
	--color-comp-btn-secondary-border-default: #9aa4b2;
	--color-comp-btn-secondary-border-hover: #9aa4b2;
	--color-comp-btn-secondary-border-pressed: #9aa4b2;
	--color-comp-btn-secondary-border-disabled: #eef2f6;
	--shadow-comp-btn-secondary-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-secondary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-secondary-danger-text-default: #f04437;
	--color-comp-btn-secondary-danger-text-hover: #f97066;
	--color-comp-btn-secondary-danger-text-pressed: #f04437;
	--color-comp-btn-secondary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-secondary-danger-icon-default: #f04437;
	--color-comp-btn-secondary-danger-icon-hover: #f97066;
	--color-comp-btn-secondary-danger-icon-pressed: #f04437;
	--color-comp-btn-secondary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-secondary-danger-bg-default: #ffffff;
	--color-comp-btn-secondary-danger-bg-hover: #fef3f2;
	--color-comp-btn-secondary-danger-bg-pressed: #fef3f2;
	--color-comp-btn-secondary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-secondary-danger-border-default: #f97066;
	--color-comp-btn-secondary-danger-border-hover: #f97066;
	--color-comp-btn-secondary-danger-border-pressed: #f97066;
	--color-comp-btn-secondary-danger-border-disabled: #eef2f6;
	--color-comp-btn-tertiary-text-default: #202939;
	--color-comp-btn-tertiary-text-hover: #364152;
	--color-comp-btn-tertiary-text-pressed: #202939;
	--color-comp-btn-tertiary-text-disabled: #9aa4b2;
	--color-comp-btn-tertiary-icon-default: #202939;
	--color-comp-btn-tertiary-icon-hover: #364152;
	--color-comp-btn-tertiary-icon-pressed: #202939;
	--color-comp-btn-tertiary-icon-disabled: #9aa4b2;
	--color-comp-btn-tertiary-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-bg-hover: #eff4ff;
	--color-comp-btn-tertiary-bg-pressed: #f8fafc;
	--color-comp-btn-tertiary-bg-disabled: #eef2f6;
	--color-comp-btn-tertiary-border-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-border-hover: #eff4ff;
	--color-comp-btn-tertiary-border-pressed: #eef2f6;
	--color-comp-btn-tertiary-border-disabled: #eef2f6;
	--shadow-comp-btn-tertiary-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-tertiary-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-tertiary-danger-text-default: #f04437;
	--color-comp-btn-tertiary-danger-text-hover: #f97066;
	--color-comp-btn-tertiary-danger-text-pressed: #f04437;
	--color-comp-btn-tertiary-danger-text-disabled: #9aa4b2;
	--color-comp-btn-tertiary-danger-icon-default: #f04437;
	--color-comp-btn-tertiary-danger-icon-hover: #f97066;
	--color-comp-btn-tertiary-danger-icon-pressed: #f04437;
	--color-comp-btn-tertiary-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-tertiary-danger-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-danger-bg-hover: #fef3f2;
	--color-comp-btn-tertiary-danger-bg-pressed: #fef3f2;
	--color-comp-btn-tertiary-danger-bg-disabled: #eef2f6;
	--color-comp-btn-tertiary-danger-border-default: rgba(0, 0, 0, 0);
	--color-comp-btn-tertiary-danger-border-hover: #fef3f2;
	--color-comp-btn-tertiary-danger-border-pressed: #fee4e2;
	--color-comp-btn-tertiary-danger-border-disabled: #eef2f6;
	--color-comp-btn-dashed-text-default: #202939;
	--color-comp-btn-dashed-text-hover: #364152;
	--color-comp-btn-dashed-text-pressed: #202939;
	--color-comp-btn-dashed-text-disabled: #9aa4b2;
	--color-comp-btn-dashed-icon-default: #202939;
	--color-comp-btn-dashed-icon-hover: #364152;
	--color-comp-btn-dashed-icon-pressed: #202939;
	--color-comp-btn-dashed-icon-disabled: #9aa4b2;
	--color-comp-btn-dashed-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-bg-disabled: #eef2f6;
	--color-comp-btn-dashed-border-default: #9aa4b2;
	--color-comp-btn-dashed-border-hover: #cdd5df;
	--color-comp-btn-dashed-border-pressed: #697586;
	--color-comp-btn-dashed-border-disabled: #eef2f6;
	--shadow-comp-btn-dashed-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-btn-dashed-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-btn-dashed-danger-text-default: #f04437;
	--color-comp-btn-dashed-danger-text-hover: #f97066;
	--color-comp-btn-dashed-danger-text-pressed: #f04437;
	--color-comp-btn-dashed-danger-text-disabled: #9aa4b2;
	--color-comp-btn-dashed-danger-icon-default: #f04437;
	--color-comp-btn-dashed-danger-icon-hover: #f97066;
	--color-comp-btn-dashed-danger-icon-pressed: #f04437;
	--color-comp-btn-dashed-danger-icon-disabled: #9aa4b2;
	--color-comp-btn-dashed-danger-bg-default: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-btn-dashed-danger-bg-disabled: #eef2f6;
	--color-comp-btn-dashed-danger-border-default: #f97066;
	--color-comp-btn-dashed-danger-border-hover: #fca19b;
	--color-comp-btn-dashed-danger-border-pressed: #f04437;
	--color-comp-btn-dashed-danger-border-disabled: #eef2f6;
}

:root[data-theme="light"] .switch {
	--color-comp-switch-track-bg-default: #ffffff;
	--color-comp-switch-track-bg-default-selected: #2970ff;
	--color-comp-switch-track-bg-hover: #f8fafc;
	--color-comp-switch-track-bg-hover-selected: #528bff;
	--color-comp-switch-track-bg-pressed: #f8fafc;
	--color-comp-switch-track-bg-pressed-selected: #004eeb;
	--color-comp-switch-track-bg-disabled: #eef2f6;
	--color-comp-switch-track-bg-disabled-selected: #cdd5df;
	--color-comp-switch-track-border-default: #9aa4b2;
	--color-comp-switch-track-border-default-selected: #2970ff;
	--color-comp-switch-track-border-hover: #9aa4b2;
	--color-comp-switch-track-border-hover-selected: #528bff;
	--color-comp-switch-track-border-pressed: #9aa4b2;
	--color-comp-switch-track-border-pressed-selected: #004eeb;
	--color-comp-switch-track-border-disabled: #eef2f6;
	--color-comp-switch-track-border-disabled-selected: #cdd5df;
	--shadow-comp-switch-track-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-hover: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-track-disabled: 0px 0px 0px 0px #00000000;
	--color-comp-switch-thumb-bg-default: #9aa4b2;
	--color-comp-switch-thumb-bg-default-selected: #ffffff;
	--color-comp-switch-thumb-bg-hover: #cdd5df;
	--color-comp-switch-thumb-bg-hover-selected: #ffffff;
	--color-comp-switch-thumb-bg-pressed: #697586;
	--color-comp-switch-thumb-bg-pressed-selected: #ffffff;
	--color-comp-switch-thumb-bg-disabled: #9aa4b2;
	--color-comp-switch-thumb-bg-disabled-selected: #ffffff;
	--color-comp-switch-thumb-border-default: #9aa4b2;
	--color-comp-switch-thumb-border-default-selected: #ffffff;
	--color-comp-switch-thumb-border-hover: #cdd5df;
	--color-comp-switch-thumb-border-hover-selected: #ffffff;
	--color-comp-switch-thumb-border-pressed: #697586;
	--color-comp-switch-thumb-border-pressed-selected: #ffffff;
	--color-comp-switch-thumb-border-disabled: #cdd5df;
	--color-comp-switch-thumb-border-disabled-selected: #ffffff;
	--shadow-comp-switch-thumb-default: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-thumb-hover: 0px 1px 2px 0px #0000004d, 0px 1px 3px 1px #00000026;
	--shadow-comp-switch-thumb-pressed: 0px 0px 0px 0px #00000000;
	--shadow-comp-switch-thumb-disabled: 0px 0px 0px 0px #00000000;
}

:root[data-theme="light"] .focusRing {
	--color-comp-focus-ring-default: #528bff;
}

:root[data-theme="light"] .tooltip {
	--color-comp-tooltip-text: #ffffff;
	--color-comp-tooltip-bg: #202939;
	--color-comp-tooltip-border: #202939;
}

:root[data-theme="light"] .breadcrumb {
	--color-comp-breadcrumb-link-text-default: #202939;
	--color-comp-breadcrumb-link-text-hover: #202939;
	--color-comp-breadcrumb-link-text-pressed: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-default: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-hover: #9aa4b2;
	--color-comp-breadcrumb-ellipsis-icon-pressed: #9aa4b2;
	--color-comp-breadcrumb-separator-icon: #9aa4b2;
	--color-comp-breadcrumb-page-text: #9aa4b2;
}

:root[data-theme="light"] .sidebar {
	--color-comp-sidebar-bg: #f5f8ff;
	--color-comp-sidebar-border: #b2ccff;
	--color-comp-sidebar-header-default-collapse-action-icon-default: #697586;
	--color-comp-sidebar-header-default-collapse-action-icon-hover: #9aa4b2;
	--color-comp-sidebar-header-default-collapse-action-icon-pressed: #364152;
	--color-comp-sidebar-header-default-collapse-action-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-bg-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-bg-pressed: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-default-collapse-action-border-pressed: rgba(0, 0, 0, 0);
	--color-comp-sidebar-header-collapsed-collapse-action-icon-default: #697586;
	--color-comp-sidebar-header-collapsed-collapse-action-icon-hover: #9aa4b2;
	--color-comp-sidebar-header-collapsed-collapse-action-icon-pressed: #364152;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-default: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-hover: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-bg-pressed: #f5f8ff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-default: #b2ccff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-hover: #b2ccff;
	--color-comp-sidebar-header-collapsed-collapse-action-border-pressed: #b2ccff;
	--color-comp-sidebar-footer-separator-divider: #e3e8ef;
	--color-comp-sidebar-footer-powered-by-text: #697586;
	--color-comp-sidebar-footer-powered-by-logo: #4b5565;
	--color-comp-sidebar-group-label-text-default: #9aa4b2;
	--color-comp-sidebar-group-label-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-group-label-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-group-label-separator-default: #9aa4b2;
	--color-comp-sidebar-menu-item-text-default: #364152;
	--color-comp-sidebar-menu-item-text-default-hover: #364152;
	--color-comp-sidebar-menu-item-text-selected: #004eeb;
	--color-comp-sidebar-menu-item-text-selected-hover: #004eeb;
	--color-comp-sidebar-menu-item-icon-default: #697586;
	--color-comp-sidebar-menu-item-icon-default-hover: #697586;
	--color-comp-sidebar-menu-item-icon-selected: #004eeb;
	--color-comp-sidebar-menu-item-icon-selected-hover: #004eeb;
	--color-comp-sidebar-menu-item-action-icon-default: #697586;
	--color-comp-sidebar-menu-item-action-icon-default-hover: #697586;
	--color-comp-sidebar-menu-item-action-icon-selected: #697586;
	--color-comp-sidebar-menu-item-action-icon-selected-hover: #697586;
	--color-comp-sidebar-menu-item-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-item-bg-default-hover: #eef2f6;
	--color-comp-sidebar-menu-item-bg-selected: #d1e0ff;
	--color-comp-sidebar-menu-item-bg-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-item-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-item-border-default-hover: #eef2f6;
	--color-comp-sidebar-menu-item-border-selected: #d1e0ff;
	--color-comp-sidebar-menu-item-border-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-connector-default: rgba(75, 85, 101, 0.10);
	--color-comp-sidebar-menu-sub-connector-selected: rgba(75, 85, 101, 0.10);
	--color-comp-sidebar-menu-sub-item-text-default: #364152;
	--color-comp-sidebar-menu-sub-item-text-default-hover: #364152;
	--color-comp-sidebar-menu-sub-item-text-selected: #004eeb;
	--color-comp-sidebar-menu-sub-item-text-selected-hover: #004eeb;
	--color-comp-sidebar-menu-sub-item-bg-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-bg-default-hover: #eef2f6;
	--color-comp-sidebar-menu-sub-item-bg-selected: #d1e0ff;
	--color-comp-sidebar-menu-sub-item-bg-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-item-border-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-border-default-hover: #eef2f6;
	--color-comp-sidebar-menu-sub-item-border-selected: #d1e0ff;
	--color-comp-sidebar-menu-sub-item-border-selected-hover: #b2ccff;
	--color-comp-sidebar-menu-sub-item-selection-default: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-selection-default-hover: rgba(0, 0, 0, 0);
	--color-comp-sidebar-menu-sub-item-selection-selected: #004eeb;
	--color-comp-sidebar-menu-sub-item-selection-selected-hover: #004eeb;
}

:root[data-theme="light"] .badge {
	--color-comp-badge-primary-info-text: #ffffff;
	--color-comp-badge-primary-info-icon: #ffffff;
	--color-comp-badge-primary-info-bg: #2970ff;
	--color-comp-badge-primary-info-border: #ffffff;
	--color-comp-badge-primary-danger-text: #ffffff;
	--color-comp-badge-primary-danger-icon: #ffffff;
	--color-comp-badge-primary-danger-bg: #f04437;
	--color-comp-badge-primary-danger-border: #ffffff;
	--color-comp-badge-primary-success-text: #ffffff;
	--color-comp-badge-primary-success-icon: #ffffff;
	--color-comp-badge-primary-success-bg: #039754;
	--color-comp-badge-primary-success-border: #ffffff;
	--color-comp-badge-primary-warning-text: #ffffff;
	--color-comp-badge-primary-warning-icon: #ffffff;
	--color-comp-badge-primary-warning-bg: #d7991f;
	--color-comp-badge-primary-warning-border: #ffffff;
	--color-comp-badge-secondary-info-text: #202939;
	--color-comp-badge-secondary-info-icon: #202939;
	--color-comp-badge-secondary-info-bg: #e3e8ef;
	--color-comp-badge-secondary-info-border: #9aa4b2;
	--color-comp-badge-secondary-danger-text: #d92c20;
	--color-comp-badge-secondary-danger-icon: #d92c20;
	--color-comp-badge-secondary-danger-bg: #fee4e2;
	--color-comp-badge-secondary-danger-border: #f04437;
	--color-comp-badge-secondary-success-text: #027a48;
	--color-comp-badge-secondary-success-icon: #027a48;
	--color-comp-badge-secondary-success-bg: #d1fadf;
	--color-comp-badge-secondary-success-border: #039754;
	--color-comp-badge-secondary-warning-text: #202939;
	--color-comp-badge-secondary-warning-icon: #202939;
	--color-comp-badge-secondary-warning-bg: #fdd890;
	--color-comp-badge-secondary-warning-border: #d7991f;
}

:root[data-theme="light"] .dropdownMenu {
	--color-comp-dropdown-menu-bg: #ffffff;
	--color-comp-dropdown-menu-border: #e3e8ef;
	--color-comp-dropdown-menu-label-text: #697586;
	--color-comp-dropdown-menu-item-text-default: #364152;
	--color-comp-dropdown-menu-item-text-hover: #364152;
	--color-comp-dropdown-menu-item-text-pressed: #364152;
	--color-comp-dropdown-menu-item-text-selected: #364152;
	--color-comp-dropdown-menu-item-text-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-icon-leading-default: #364152;
	--color-comp-dropdown-menu-item-icon-leading-hover: #364152;
	--color-comp-dropdown-menu-item-icon-leading-pressed: #364152;
	--color-comp-dropdown-menu-item-icon-leading-selected: #364152;
	--color-comp-dropdown-menu-item-icon-leading-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-icon-trailing-default: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-hover: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-pressed: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-selected: #364152;
	--color-comp-dropdown-menu-item-icon-trailing-disabled: #9aa4b2;
	--color-comp-dropdown-menu-item-bg-default: #ffffff;
	--color-comp-dropdown-menu-item-bg-hover: #f5f8ff;
	--color-comp-dropdown-menu-item-bg-pressed: #eff4ff;
	--color-comp-dropdown-menu-item-bg-selected: #eff4ff;
	--color-comp-dropdown-menu-item-bg-disabled: #f8fafc;
	--color-comp-dropdown-menu-item-border-default: #ffffff;
	--color-comp-dropdown-menu-item-border-hover: #f5f8ff;
	--color-comp-dropdown-menu-item-border-pressed: #eff4ff;
	--color-comp-dropdown-menu-item-border-selected: #eff4ff;
	--color-comp-dropdown-menu-item-border-disabled: #f8fafc;
	--color-comp-dropdown-menu-item-indicator-icon-default: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-hover: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-pressed: #364152;
	--color-comp-dropdown-menu-item-indicator-icon-checked: #2970ff;
	--color-comp-dropdown-menu-item-indicator-icon-disabled: #9aa4b2;
	--color-comp-dropdown-menu-shortcut-text-default: #697586;
	--color-comp-dropdown-menu-shortcut-text-hover: #697586;
	--color-comp-dropdown-menu-shortcut-text-pressed: #697586;
	--color-comp-dropdown-menu-shortcut-text-selected: #697586;
	--color-comp-dropdown-menu-shortcut-text-disabled: #9aa4b2;
	--color-comp-dropdown-menu-separator-line: #e3e8ef;
	--shadow-comp-dropdown-menu-content: 0px 1px 2px 0px #0000004d, 0px 1px 3px 1px #00000026;
}
@media (max-width: 768px) {
	:root[lang="ar"] {
		--typography-display-medium: 700 48px/56px 'IBM Plex Sans Arabic';
		--typography-headline-large: 700 40px/48px 'IBM Plex Sans Arabic';
		--typography-headline-medium: 600 32px/44px 'IBM Plex Sans Arabic';
		--typography-headline-small: 600 24px/32px 'IBM Plex Sans Arabic';
		--typography-title-large: 600 20px/32px 'IBM Plex Sans Arabic';
		--typography-title-medium: 600 16px/28px 'IBM Plex Sans Arabic';
		--typography-title-small: 600 14px/24px 'IBM Plex Sans Arabic';
		--typography-body-large: 400 16px/28px 'IBM Plex Sans Arabic';
		--typography-body-medium: 400 14px/24px 'IBM Plex Sans Arabic';
		--typography-body-small: 400 12px/18px 'IBM Plex Sans Arabic';
		--typography-label-large: 500 16px/24px 'IBM Plex Sans Arabic';
		--typography-label-medium: 500 14px/24px 'IBM Plex Sans Arabic';
		--typography-label-small: 500 12px/18px 'IBM Plex Sans Arabic';
	}
}
@media (max-width: 768px) {
	:root[lang="en"] {
		--typography-display-medium: 700 48px/56px Poppins;
		--typography-headline-large: 700 40px/48px Poppins;
		--typography-headline-medium: 600 32px/40px Poppins;
		--typography-headline-small: 600 24px/32px Poppins;
		--typography-title-large: 600 20px/28px Poppins;
		--typography-title-medium: 600 16px/24px Poppins;
		--typography-title-small: 600 14px/20px Poppins;
		--typography-body-large: 400 16px/24px Poppins;
		--typography-body-medium: 400 14px/20px Poppins;
		--typography-body-small: 400 12px/16px Poppins;
		--typography-label-large: 500 16px/24px Poppins;
		--typography-label-medium: 500 14px/20px Poppins;
		--typography-label-small: 500 12px/16px Poppins;
	}
}
@media (max-width: 768px) {
	:root {
		--dimension-sys-corner-none: 0px;
		--dimension-sys-corner-xs: 2px;
		--dimension-sys-corner-s: 4px;
		--dimension-sys-corner-m: 8px;
		--dimension-sys-corner-l: 16px;
		--dimension-sys-corner-xl: 32px;
		--dimension-sys-corner-full: 400px;
		--dimension-sys-spacing-none: 0px;
		--dimension-sys-spacing-xs: 4px;
		--dimension-sys-spacing-s: 8px;
		--dimension-sys-spacing-m: 16px;
		--dimension-sys-spacing-l: 24px;
		--dimension-sys-spacing-xl: 40px;
		--dimension-sys-size-none: 0px;
		--dimension-sys-size-xs: 8px;
		--dimension-sys-size-s: 16px;
		--dimension-sys-size-m: 24px;
		--dimension-sys-size-l: 32px;
		--dimension-sys-size-xl: 40px;
		--dimension-sys-size-xxl: 48px;
		--dimension-sys-stroke-solid: solid;
		--dimension-sys-stroke-dashed: solid;
		--dimension-sys-focus-ring-outline-width: 2px;
		--dimension-sys-focus-ring-outline-offset: 2px;
		--dimension-sys-focus-ring-stroke-style: solid;
		--dimension-sys-icon-size-s: 16px;
		--dimension-sys-icon-size-m: 24px;
		--dimension-sys-icon-size-l: 32px;
		--transition-sys-duration-fast: 50ms;
		--transition-sys-duration-medium: 500ms;
		--transition-sys-duration-slow: 1000ms;
	}
}


@media (max-width: 768px) {
	:root .btn {
		--dimension-comp-btn-m-spacing-v: 12px;
		--dimension-comp-btn-m-spacing-h: 12px;
		--dimension-comp-btn-m-height: 40px;
		--dimension-comp-btn-m-width-min: 40px;
		--dimension-comp-btn-m-gap: 4px;
		--dimension-comp-btn-m-border-radius: 8px;
		--dimension-comp-btn-m-border-width: 1px;
		--dimension-comp-btn-m-stroke-style: solid;
		--dimension-comp-btn-m-focus-ring-radius: 10px;
		--dimension-comp-btn-m-icon-size: 16px;
		--dimension-comp-btn-s-spacing-v: 8px;
		--dimension-comp-btn-s-spacing-h: 12px;
		--dimension-comp-btn-s-height: 32px;
		--dimension-comp-btn-s-width-min: 32px;
		--dimension-comp-btn-s-gap: 4px;
		--dimension-comp-btn-s-border-radius: 8px;
		--dimension-comp-btn-s-border-width: 1px;
		--dimension-comp-btn-s-stroke-style: solid;
		--dimension-comp-btn-s-focus-ring-radius: 10px;
		--dimension-comp-btn-s-icon-size: 12px;
		--dimension-comp-btn-primary-m-spacing-v: 12px;
		--dimension-comp-btn-primary-m-spacing-h: 12px;
		--dimension-comp-btn-primary-m-height: 40px;
		--dimension-comp-btn-primary-m-width-min: 40px;
		--dimension-comp-btn-primary-m-gap: 4px;
		--dimension-comp-btn-primary-m-border-radius: 8px;
		--dimension-comp-btn-primary-m-border-width: 1px;
		--dimension-comp-btn-primary-m-stroke-style: solid;
		--dimension-comp-btn-primary-m-focus-ring-radius: 10px;
		--dimension-comp-btn-primary-m-icon-size: 16px;
		--dimension-comp-btn-primary-s-spacing-v: 8px;
		--dimension-comp-btn-primary-s-spacing-h: 12px;
		--dimension-comp-btn-primary-s-height: 32px;
		--dimension-comp-btn-primary-s-width-min: 32px;
		--dimension-comp-btn-primary-s-gap: 4px;
		--dimension-comp-btn-primary-s-border-radius: 8px;
		--dimension-comp-btn-primary-s-border-width: 1px;
		--dimension-comp-btn-primary-s-stroke-style: solid;
		--dimension-comp-btn-primary-s-focus-ring-radius: 10px;
		--dimension-comp-btn-primary-s-icon-size: 12px;
		--transition-comp-btn-hover-duration: 50ms;
		--transition-comp-btn-hover-easing: 0.5,0,1,1;
		--transition-comp-btn-press-duration: 50ms;
		--transition-comp-btn-press-easing: 0.5,0,1,1;
	}

	:root .switch {
		--dimension-comp-switch-track-spacing: 2px;
		--dimension-comp-switch-track-height: 20px;
		--dimension-comp-switch-track-width: 36px;
		--dimension-comp-switch-track-border-radius: 400px;
		--dimension-comp-switch-track-border-width: 1px;
		--dimension-comp-switch-track-focus-ring-radius: 402px;
		--dimension-comp-switch-thumb-height: 16px;
		--dimension-comp-switch-thumb-width: 16px;
		--dimension-comp-switch-thumb-border-radius: 400px;
		--dimension-comp-switch-thumb-border-width: 0px;
	}

	:root .focusRing {
		--dimension-comp-focus-ring-outline-width: 2px;
		--dimension-comp-focus-ring-outline-offset: 2px;
		--dimension-comp-focus-ring-stroke-style: solid;
	}

	:root .tooltip {
		--dimension-comp-tooltip-spacing-v: 6px;
		--dimension-comp-tooltip-spacing-h: 6px;
		--dimension-comp-tooltip-width-max-s: 140px;
		--dimension-comp-tooltip-width-max-m: 280px;
		--dimension-comp-tooltip-width-max-l: 420px;
		--dimension-comp-tooltip-border-radius: 4px;
		--dimension-comp-tooltip-border-width: 1px;
		--dimension-comp-tooltip-offset: 4px;
		--dimension-comp-tooltip-arrow-spacing: 4px;
	}

	:root .breadcrumb {
		--dimension-comp-breadcrumb-gap: 8px;
		--dimension-comp-breadcrumb-spacing-v: 4px;
		--dimension-comp-breadcrumb-ellipsis-size: 16px;
		--dimension-comp-breadcrumb-separator-size: 16px;
	}

	:root .sidebar {
		--dimension-comp-sidebar-width-default: 256px;
		--dimension-comp-sidebar-width-compact: 56px;
		--dimension-comp-sidebar-spacing-v: 4px;
		--dimension-comp-sidebar-spacing-h: 4px;
		--dimension-comp-sidebar-border-radius: 12px;
		--dimension-comp-sidebar-border-width: 1px;
		--dimension-comp-sidebar-stroke-style: solid;
		--dimension-comp-sidebar-header-default-spacing-v: 12px;
		--dimension-comp-sidebar-header-default-spacing-h-leading: 12px;
		--dimension-comp-sidebar-header-default-spacing-h-trailing: 12px;
		--dimension-comp-sidebar-header-default-gap: 4px;
		--dimension-comp-sidebar-header-default-logo-height: 36px;
		--dimension-comp-sidebar-header-default-collapse-action-icon-size: 20px;
		--dimension-comp-sidebar-header-default-collapse-action-spacing-v: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-spacing-h: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-border-radius: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-border-width: 0px;
		--dimension-comp-sidebar-header-default-collapse-action-stroke-style: solid;
		--dimension-comp-sidebar-header-collapsed-spacing-v: 12px;
		--dimension-comp-sidebar-header-collapsed-spacing-h-leading: 6px;
		--dimension-comp-sidebar-header-collapsed-spacing-h-trailing: 0px;
		--dimension-comp-sidebar-header-collapsed-gap: 5px;
		--dimension-comp-sidebar-header-collapsed-logo-height: 36px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-icon-size: 20px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-spacing-v: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-spacing-h: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-border-radius: 8px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-border-width: 1px;
		--dimension-comp-sidebar-header-collapsed-collapse-action-stroke-style: solid;
		--dimension-comp-sidebar-content-default-spacing-v: 0px;
		--dimension-comp-sidebar-content-default-spacing-h: 6px;
		--dimension-comp-sidebar-content-collapsed-spacing-v: 0px;
		--dimension-comp-sidebar-content-collapsed-spacing-h: 6px;
		--dimension-comp-sidebar-footer-default-spacing-v: 12px;
		--dimension-comp-sidebar-footer-default-spacing-h: 6px;
		--dimension-comp-sidebar-footer-default-separator-spacing-v: 12px;
		--dimension-comp-sidebar-footer-default-separator-spacing-h: 8px;
		--dimension-comp-sidebar-footer-default-separator-border-width: 1px;
		--dimension-comp-sidebar-footer-default-separator-stroke-style: solid;
		--dimension-comp-sidebar-footer-default-powered-by-logo-height: 14px;
		--dimension-comp-sidebar-footer-default-powered-by-spacing-h: 8px;
		--dimension-comp-sidebar-footer-default-powered-by-height: 16px;
		--dimension-comp-sidebar-footer-collapsed-spacing-v: 12px;
		--dimension-comp-sidebar-footer-collapsed-spacing-h: 6px;
		--dimension-comp-sidebar-footer-collapsed-separator-spacing-v: 12px;
		--dimension-comp-sidebar-footer-collapsed-separator-spacing-h: 8px;
		--dimension-comp-sidebar-footer-collapsed-separator-border-width: 1px;
		--dimension-comp-sidebar-footer-collapsed-separator-stroke-style: solid;
		--dimension-comp-sidebar-footer-collapsed-powered-by-logo-height: 14px;
		--dimension-comp-sidebar-footer-collapsed-powered-by-spacing-h: 8px;
		--dimension-comp-sidebar-footer-collapsed-powered-by-height: 16px;
		--dimension-comp-sidebar-group-label-default-spacing-v: 10px;
		--dimension-comp-sidebar-group-label-default-spacing-h: 10px;
		--dimension-comp-sidebar-group-label-default-height: 36px;
		--dimension-comp-sidebar-group-label-compact-spacing-v: 10px;
		--dimension-comp-sidebar-group-label-compact-spacing-h: 10px;
		--dimension-comp-sidebar-group-label-compact-width-min: 36px;
		--dimension-comp-sidebar-group-label-compact-height: 36px;
		--dimension-comp-sidebar-group-label-compact-separator-border-width: 1px;
		--dimension-comp-sidebar-group-label-compact-separator-stroke-style: solid;
		--dimension-comp-sidebar-menu-border-radius: 12px;
		--dimension-comp-sidebar-menu-item-default-text-spacing-v: 10px;
		--dimension-comp-sidebar-menu-item-default-icon-size: 20px;
		--dimension-comp-sidebar-menu-item-default-icon-spacing-v: 8px;
		--dimension-comp-sidebar-menu-item-default-action-icon-size: 16px;
		--dimension-comp-sidebar-menu-item-default-spacing-h: 8px;
		--dimension-comp-sidebar-menu-item-default-gap: 8px;
		--dimension-comp-sidebar-menu-item-default-border-radius: 8px;
		--dimension-comp-sidebar-menu-item-default-border-width: 1px;
		--dimension-comp-sidebar-menu-item-default-stroke-style: solid;
		--dimension-comp-sidebar-menu-item-default-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-item-compact-icon-size: 20px;
		--dimension-comp-sidebar-menu-item-compact-icon-spacing-v: 8px;
		--dimension-comp-sidebar-menu-item-compact-spacing-h: 8px;
		--dimension-comp-sidebar-menu-item-compact-gap: 8px;
		--dimension-comp-sidebar-menu-item-compact-border-radius: 8px;
		--dimension-comp-sidebar-menu-item-compact-border-width: 1px;
		--dimension-comp-sidebar-menu-item-compact-stroke-style: solid;
		--dimension-comp-sidebar-menu-item-compact-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-item-compact-width-min: 36px;
		--dimension-comp-sidebar-menu-sub-margin-leading: 17px;
		--dimension-comp-sidebar-menu-sub-margin-trailing: 0px;
		--dimension-comp-sidebar-menu-sub-spacing-leading: 9px;
		--dimension-comp-sidebar-menu-sub-spacing-trailing: 0px;
		--dimension-comp-sidebar-menu-sub-connector-border-width: 2px;
		--dimension-comp-sidebar-menu-sub-connector-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-connector-linecap: butt;
		--dimension-comp-sidebar-menu-sub-item-text-spacing-v: 10px;
		--dimension-comp-sidebar-menu-sub-item-spacing-h: 8px;
		--dimension-comp-sidebar-menu-sub-item-gap: 8px;
		--dimension-comp-sidebar-menu-sub-item-border-radius: 8px;
		--dimension-comp-sidebar-menu-sub-item-border-width: 1px;
		--dimension-comp-sidebar-menu-sub-item-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-item-focus-ring-radius: 10px;
		--dimension-comp-sidebar-menu-sub-item-selection-spacing-v: 8px;
		--dimension-comp-sidebar-menu-sub-item-selection-border-width: 2px;
		--dimension-comp-sidebar-menu-sub-item-selection-stroke-style: solid;
		--dimension-comp-sidebar-menu-sub-item-selection-linecap: butt;
	}

	:root .badge {
		--dimension-comp-badge-icon-size: 12px;
		--dimension-comp-badge-height: 24px;
		--dimension-comp-badge-spacing-h: 6px;
		--dimension-comp-badge-dot-height: 6px;
		--dimension-comp-badge-gap: 4px;
		--dimension-comp-badge-width-min: 24px;
		--dimension-comp-badge-border-radius: 400px;
		--dimension-comp-badge-border-width: 1px;
		--dimension-comp-badge-stroke-style: solid;
	}

	:root .dropdownMenu {
		--dimension-comp-dropdown-menu-side-offset: 8px;
		--dimension-comp-dropdown-menu-arrow-spacing-h: 16px;
		--dimension-comp-dropdown-menu-content-spacing-v: 4px;
		--dimension-comp-dropdown-menu-content-spacing-h: 4px;
		--dimension-comp-dropdown-menu-content-width: 200px;
		--dimension-comp-dropdown-menu-content-gap: 0px;
		--dimension-comp-dropdown-menu-content-border-radius: 8px;
		--dimension-comp-dropdown-menu-content-border-width: 1px;
		--dimension-comp-dropdown-menu-content-stroke-style: solid;
		--dimension-comp-dropdown-menu-label-spacing-v: 8px;
		--dimension-comp-dropdown-menu-label-spacing-h: 12px;
		--dimension-comp-dropdown-menu-group-spacing-v: 0px;
		--dimension-comp-dropdown-menu-group-spacing-h: 0px;
		--dimension-comp-dropdown-menu-group-gap: 0px;
		--dimension-comp-dropdown-menu-item-spacing-v: 12px;
		--dimension-comp-dropdown-menu-item-spacing-h: 12px;
		--dimension-comp-dropdown-menu-item-gap: 6px;
		--dimension-comp-dropdown-menu-item-border-radius: 6px;
		--dimension-comp-dropdown-menu-item-border-width: 1px;
		--dimension-comp-dropdown-menu-item-stroke-style: solid;
		--dimension-comp-dropdown-menu-item-focus-ring-radius: 8px;
		--dimension-comp-dropdown-menu-item-icon-leading-size: 20px;
		--dimension-comp-dropdown-menu-item-icon-trailing-size: 20px;
		--dimension-comp-dropdown-menu-item-image-size: 24px;
		--dimension-comp-dropdown-menu-item-indicator-spacing-v: 0px;
		--dimension-comp-dropdown-menu-item-indicator-spacing-h: 0px;
		--dimension-comp-dropdown-menu-item-indicator-icon-size: 20px;
		--dimension-comp-dropdown-menu-separator-spacing-v: 4px;
		--dimension-comp-dropdown-menu-separator-spacing-h: -4px;
		--dimension-comp-dropdown-menu-separator-border-width: 1px;
		--dimension-comp-dropdown-menu-separator-stroke-style: solid;
	}

}
